<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="/jQuery_class_stu/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
	$("#appendBtn").on("click", function(){
		//$(셀렉터).append("붙일 내용"); 셀렉터의 마지막 자식 노드로 붙일 내용을 추가
		$("#source").append("<p>안녕하세요.</p>");
		//$(붙일 내용).appendTo("셀렉터")
		$("<p>하하하</p>").appendTo("#source");
	});
	$("#prependBtn").on("click", function(){
		//$(셀렉터).prepend("붙일 내용"); 셀렉터의 첫 자식 노드로 붙일 내용을 붙인다.
		//$("#target").prepend("<p><font color='blue'>Hi</font></p>");
		$("<font color='red'>HaHaHa</font>").prependTo("#target");
	});
	
	$("#moveBtn").on("click", function(){
		//$("#target").append("#source");
		$("#source").appendTo("#target");
		//$("#target").append($("#source"));
	});
	$("#clearBtn").on("click", function(){
		//$(셀렉터).remove(); 셀렉트된 노드들을 삭제
		//$("#tbody").remove();
		//$("div").remove("#source");
		//$(셀렉터).empty(); 모든 자식노드들 삭제
		$("#tbody").empty().append("<tr><td>새-id</td><td>새이름</td><td>30</td></tr>");
	});
});
</script>
</head>
<body>
<fieldset>
	<legend>소스</legend>
	<div id="source">안녕하세요...출발지의 텍스트입니다.</div>
</fieldset>
<fieldset>
	<legend>타겟</legend>
	<div id="target">여기는 목적지 입니다.</div>
</fieldset>
<button id="appendBtn">append</button>
<button id="prependBtn">prepend</button>
<button id="moveBtn">dom node 옮기기</button>
<p>
<table border='1'>
<thead>
	<tr>
		<td>ID</td>
		<td>이름</td>
		<td>나이</td>
	</tr>
</thead>
<tbody id="tbody">
	<tr>
		<td>id-a</td>
		<td>홍길동</td>
		<td>20</td>
	</tr>
	<tr>
		<td>id-a</td>
		<td>홍길동</td>
		<td>20</td>
	</tr>	
	<tr>
		<td>id-a</td>
		<td>홍길동</td>
		<td>20</td>
	</tr>			
</tbody>
<tfoot>
	<tr>
		<td colspan='3'><button id="clearBtn">내용 삭제</button></td>
	</tr>
</tfoot>
</table>
</body>
</html>


















